<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>Plus Admin</title>
    <link rel="shortcut icon" href="./res/images/logo.ico" type="image/x-icon" />
    <link rel="icon" href="./res/images/logo.ico" type="image/x-icon" />
    <meta name="keywords" content="layui,简洁的ui框架,面向后端的前端框架,丰富业务组件">
    <meta name="description" content="Plus Admin是一个基于layui，轻量、简约包含丰富模块的前端框架，帮您快速构建网站。">
    <link rel="stylesheet" href="res/libs/layui/css/layui.css" />
    <link rel="stylesheet" href="res/css/plus-admin.css">
</head>

<body>
    <div class="plus-admin-layout">
        <!--头部-->
        <div class="plus-admin-header">
            <div class="header-logo">
                <span>Plus</span>
            </div>
            <ul class="header-left">
                <li><a class="header-left-menu" plus-tools="menuToggle">➡️</a></li>
                <li><a href="">📆</a></li>
                <li><a id="plus">🔍</a></li>
            </ul>
            <ul class="header-top">
                <div id="plus"></div>
            </ul>
            <ul class="header-tools">
                <li><a href="">🛎️</a></li>
                <li><a href="">📣</a></li>
                <li><a href="">🎨</a></li>
            </ul>
            <ul class="layui-nav header-right">
                <li class="layui-nav-item  header-right-item">
                    <a><img src="./res/images/logo.png" class="layui-nav-img">Plus</a>
                    <dl class="layui-nav-child">
                        <dd><a href="javascript:;">个人信息</a></dd>
                        <dd><a href="javascript:;">账号信息</a></dd>
                        <dd><a href="javascript:;" plus-tools="logout">退出</a></dd>
                    </dl>
                </li>
            </ul>
        </div>

        <!--菜单-->
        <div class="plus-admin-menu fold" style="display:none">
            <ul class="plus-admin-menu-items" lay-filter="plus-admin-menu-nav"></ul>
        </div>

        <!--子菜单-->
        <div class="plus-admin-submenu" style="display:none">
            <div class="plus-admin-submenu-fixed open" plus-tools="fixedToggle">
                <i class="layui-icon-left"></i>
            </div>
            <div class="submenu-title">
                <span class="submenu-title-span"></span>
            </div>
            <ul class="layui-nav layui-nav-tree bg-white" lay-filter="plus-admin-submenu-nav" lay-shrink="all"></ul>
        </div>

        <!-- 视图 -->
        <div class="plus-admin-body"></div>

        <!--面板-->
        <div class="plus-admin-panel fold">
            <div class="plus-admin-panel-drawer" plus-tools="drawerToggle">
                <i class="layui-icon-close"></i>
            </div>
            <div class="layui-collapse">
                <div class="layui-colla-item">
                    <h2 class="layui-colla-title panel-item">
                        ⚠️ <span class="panel-item-title">更新日志</span>
                    </h2>
                    <div class="layui-colla-content layui-show item-color">
                        <ul>
                            <li>初始化后台代码...</li>
                        </ul>
                    </div>
                </div>
                <div class="layui-colla-item">
                    <h2 class="layui-colla-title panel-item">
                        🔖 <span class="panel-item-title">工作日志</span></h2>
                    <div class="layui-colla-content item-color">
                        <ul>
                            <li>plus admin 上线了...<span class="layui-badge">2022-09-22</span></li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>

        <!--个人中心-->
        <div id="userCenter" class="layui-anim layui-anim-up user-card" style="display:none">
            <div class="user-card-group">
                <div class="user-card-title">🧑‍💼 个人</div>
                <div class="user-card-body">
                    <div class="user-card-list">
                        <div class="user-card-list-item">
                            <span class="list-item-name">Adminstrator</span>
                        </div>
                    </div>
                    <div class="user-card-list bottom"></div>
                </div>
                <div class="user-card-title">🏢 我的公司</div>
                <div class="user-card-body">
                    <div class="user-card-list plus-this">
                        <div class="user-card-list-item">
                            <span class="layui-badge bg-success">认证</span>
                            <span class="list-item-name">杭州环球旅游有限公司</span>
                            <i class="layui-icon-ok text-danger"></i>
                        </div>
                    </div>
                    <div class="user-card-list">
                        <div class="user-card-list-item">
                            <span class="list-item-name">北京物流</span>
                        </div>
                    </div>
                    <div class="user-card-list">
                        <div class="user-card-list-item">
                            <span class="list-item-name">杭州雷霆有限公司</span>
                        </div>
                    </div>
                    <div class="user-card-list bottom"></div>
                </div>
                <div class="user-card-tools">
                    <div class="tools-item">🖥️</div>
                    <div class="tools-item">📩</div>
                    <div class="tools-item">🔍</div>
                    <div class="tools-item">🍀</div>
                    <div class="tools-item">🍁</div>
                    <div class="tools-item">⏰</div>
                    <div class="tools-item">🪐</div>
                    <div class="tools-item">♥️</div>
                </div>
            </div>
            <div class="user-info">
                <div class="user-info-list">🛖 研发部</div>
                <div class="user-info-list">👔 技术总监</div>
                <div class="user-info-list">📛 zxy</div>
                <div class="user-info-list">📞 15329145879</div>
                <hr>
                <div class="user-info-list">
                    🪙 <span class="text-primary" style="font-weight:bold">100.56</span> 元
                    <a class="layui-btn text sm text-danger pull-right">消费记录</a>
                </div>
                <div class="user-info-list bottom">
                    <a class="layui-btn primary xs layui-btn-fluid">余额充值</a>
                </div>
            </div>
        </div>

        <!--版权-->
        <div class="plus-admin-copyright">
            copyright ©️ 2022 <a href="" target="_blank">plus admin</a> all rights reserved.
            <span>Version 1.0.0</span>
        </div>
    </div>

    <script id="topMenuNav" type="text/html">
        {{# layui.each(d, function(index, item){ }}
        {{# var hasChild=item.subMenus&&item.subMenus.length>0?1:0 }}
            <li class="menu-item">
                <a href="{{item.url}}" target="{{item.target}}" haschild="{{hasChild}}" plus-id="{{item.id}}" plus-title="{{item.name}}">
                    <span class="menu-item-icon">{{item.icon}}</span>
                    <span class="menu-item-title">{{ item.name }}</span>
                    {{#if(hasChild==1){ }}
                    <i class="layui-icon-down pull-right"></i>
                    {{# } }}
                </a>
            </li>
        {{#  }); }}
        <li class="menu-item user-center">
            <a href="javascript:void(0);">
                <span class="menu-item-icon">📑</span>
                <span class="menu-item-title">个人中心</span>
            </a>
        </li>
     </script>

    <script id="menuNav" type="text/html">
    {{# layui.each(d, function(index, item){ }}
    {{# var hasChild=item.subMenus&&item.subMenus.length>0?1:0 }}
        <li class="menu-item">
            <a href="{{item.url}}" target="{{item.target}}" haschild="{{hasChild}}" plus-id="{{item.id}}" plus-title="{{item.name}}">
                <span class="menu-item-icon">{{item.icon}}</span>
                <span class="menu-item-title">{{ item.name }}</span>
                {{#if(hasChild==1){ }}
                <i class="layui-icon-right pull-right"></i>
                {{# } }}
            </a>
            <div class="menu-item-tips">
                <div class="menu-item-tip">
                    <span>{{item.icon}}</span>
                    <span class="tip-span">{{ item.name }}</span>
                </div>
            </div>
        </li>
    {{#  }); }}
    <li class="menu-item item-bottom user-center">
        <a href="javascript:void(0);">
            <span class="menu-item-icon">📑</span>
            <span class="menu-item-title">个人中心</span>
        </a>
    </li>
    </script>

    <script id="subMenuNav" type="text/html">
        {{#$(".submenu-title-span").text(d.info.name) }}
        {{# layui.each(d.data, function(index, item){ }}
        <li class="layui-nav-item">
            <a href="{{item.url}}" target="{{item.target}}" plus-parentid="{{d.info.id}}" haschild="{{d.info.haschild}}">
                {{# if(item.icon){ }}
                {{item.icon}}
                {{# }else{ }}
                  &emsp;
                {{#} }}
                <cite>{{ item.name }}</cite>
            </a>
            {{# if(item.subMenus&&item.subMenus.length>0){ getSubMenus(item.subMenus); } }}
        </li>
        {{# }); }}
        {{# function getSubMenus(subMenus){ }}
        <dl class="layui-nav-child">
            {{# layui.each(subMenus, function(index, subItem){ }}
            <dd>
                <a href="{{ subItem.url }}" target="{{subItem.target}}" plus-parentid="{{d.info.id}}" haschild="{{d.info.haschild}}">
                    {{# if(subItem.icon){ }}
                      <i class="{{subItem.icon}}"></i>
                    {{# } }}&nbsp;
                    {{ subItem.name }}
                </a>
                {{# if(subItem.subMenus&&subItem.subMenus.length>0){ getSubMenus(subItem.subMenus); } }}
            </dd>
            {{# }); }}
        </dl>
        {{# } }}
    </script>

    <script src="res/libs/layui/layui.js"></script>
    <script src="res/js/core.js"></script>
    <script>
        dropdown.render({
            elem: '#plus'
            , data: [{
                title: 'menu item 1'
                , templet: '<i class="layui-icon layui-icon-picture"></i> {{d.title}} <span class="layui-badge-dot"></span>'
                , id: 100
                , href: '#'
            }, {
                title: 'menu item 2'
                , templet: '<img src="//oss.layuion.com/avatar/168.jpg?t=123" style="width: 16px;"> {{d.title}} '
                , id: 101
                , href: '/'
                , target: '_blank'
            }
                , { type: '-' } //分割线
                , {
                title: 'menu item 3'
                , id: 102
                , type: 'group'
                , child: [{
                    title: 'menu item 3-1'
                    , id: 103
                }, {
                    title: 'menu item 3-2'
                    , id: 104
                    , child: [{
                        title: 'menu item 3-2-1'
                        , id: 105
                    }, {
                        title: 'menu item 3-2-2'
                        , id: 11
                        , type: 'group'
                        , child: [{
                            title: 'menu item 3-2-2-1'
                            , id: 111
                        }, {
                            title: 'menu item 3-2-2-2'
                            , id: 1111
                        }]
                    }, {
                        title: 'menu item 3-2-3'
                        , id: 11111
                    }]
                }, {
                    title: 'menu item 3-3'
                    , id: 111111
                    , type: 'group'
                    , child: [{
                        title: 'menu item 3-3-1'
                        , id: 22
                    }, {
                        title: 'menu item 3-3-2'
                        , id: 222
                        , child: [{
                            title: 'menu item 3-3-2-1'
                            , id: 2222
                        }, {
                            title: 'menu item 3-3-2-2'
                            , id: 22222
                        }, {
                            title: 'menu item 3-3-2-3'
                            , id: 2222222
                        }]
                    }, {
                        title: 'menu item 3-3-3'
                        , id: 333
                    }]
                }]
            }
                , { type: '-' }
                , {
                title: 'menu item 4'
                , id: 4
            }, {
                title: 'menu item 5'
                , id: 5
                , child: [{
                    title: 'menu item 5-1'
                    , id: 55
                    , child: [{
                        title: 'menu item 5-1-1'
                        , id: 5555
                    }, {
                        title: 'menu item 5-1-2'
                        , id: 55555
                    }, {
                        title: 'menu item 5-1-3'
                        , id: 555555
                    }]
                }, {
                    title: 'menu item 5-2'
                    , id: 52
                }, {
                    title: 'menu item 5-3'
                    , id: 53
                }]
            }, { type: '-' }, {
                title: 'menu item 6'
                , id: 66
                , type: 'group'
                , isSpreadItem: false
                , child: [{
                    title: 'menu item 6-1'
                    , id: 666
                }, {
                    title: 'menu item 6-2'
                    , id: 6666
                }, {
                    title: 'menu item 6-3'
                    , id: 66666
                }]
            }]
            , click: function (item) {
                layer.msg(util.escape(JSON.stringify(item)));
            }
        });

    </script>
</body>

</html>